<template>
  <div>
      <p class="changeTime" v-if="flag1">
          <span :class="flag1==1?'active':''" @click="handleWeek">本周</span>

          <span :class="flag1==2?'active':''" @click="handleMonth">本月</span>

          <span :class="flag1==3?'active':''" @click="handleYear">本年</span>
      </p>
      <week ref="chart"></week>

  </div>
</template>

<script>
import moment from "moment"
import week from "../../../components/echarts/week.vue"
export default {
  data(){
    return{
      flag1:1,
      newstudent:[],
      week:{},
      month:{},
      year:{},
      weeknum:[],
      weekobj:[],
    }
  },
  components:{
    week,
  },
  methods:{
    handleWeek(){
      this.flag1=1
      const num = Date.now();
      const day =new Date().getDay();
      this.week={
        from:new Date(num-60*60*24*((day?day:7)-1)*1000).toLocaleDateString(),
        to:num
      }
      this.$axios({
          method:'post',
          url:'/v4/backAdmin/getschoolclazz',
          xsrfCookieName: 'csrfToken', // default
          xsrfHeaderName: 'x-csrf-token', // 默认的
          data:{
            starttime:this.week.from,
            endtime:this.week.to,
            schoolid:this.$route.params.ID
          }
        }).then((data)=>{
            console.log(data.data.data)
            this.newstudent=data.data.data
            this.$refs.chart.creatdata(this.newstudent,'周','createdAt')
        }).catch((err)=>{
            console.log(err)
        })
    },
    handleMonth(){
      this.flag1=2
      const num = Date.now();
      const date = new Date().getDate();
      this.month={
        from: new Date( num - 60 * 60 * 24 * (date - 1) * 1000).toLocaleDateString(),
        to:num
      }
      this.$axios({
        method:'post',
        url:'/v4/backAdmin/getschoolclazz',
        xsrfCookieName: 'csrfToken', // default
          xsrfHeaderName: 'x-csrf-token', // 默认的
        data:{
          starttime:this.month.from,
          endtime:this.month.to,
          schoolid:this.$route.params.ID
        }
      }).then((data)=>{
          console.log(data.data.data)
          this.newstudent=data.data.data
          const day=moment().endOf('month').format('DD')
          this.$refs.chart.creatdata(this.newstudent,'月','createdAt',day)
          
      }).catch((err)=>{
          console.log(err)
      })
    },
    handleYear(){
      this.flag1=3
      const num = Date.now();
      const fromyear = new Date().getFullYear();
      this.year={
        from: `${fromyear}/1/1`,
        to:num
      }
      this.$axios({
        method:'post',
        url:'/v4/backAdmin/getschoolclazz',
        xsrfCookieName: 'csrfToken', // default
          xsrfHeaderName: 'x-csrf-token', // 默认的
        data:{
          starttime:this.year.from,
          endtime:this.year.to,
          schoolid:this.$route.params.ID
        }
      }).then((data)=>{
          console.log(data.data.data)
          this.newstudent=data.data.data
          this.$refs.chart.creatdata(this.newstudent,'年','createdAt')
          this.$nextTick(()=>{
              this.handleWeek()
          })
      }).catch((err)=>{
          console.log(err)
      })
    },
  },
  watch: {
    pieData() {
    this.$nextTick(() => {
    if (this.newstudent) {
    this.handleweek()
    }
    })
    }
 },
  created(){
    const num = Date.now();
    const day =new Date().getDay();
    this.week={
      from:new Date(num-60*60*24*((day?day:7)-1)*1000).toLocaleDateString(),
      to:num
    }
    this.$axios({
        method:'post',
        url:'/v4/backAdmin/getschoolclazz',
        xsrfCookieName: 'csrfToken', // default
          xsrfHeaderName: 'x-csrf-token', // 默认的
        data:{
          starttime:this.week.from,
          endtime:this.week.to,
          schoolid:this.$route.params.ID
        }
      }).then((data)=>{
          console.log(data.data.data)
          this.newstudent=data.data.data
          this.$refs.chart.creatdata(this.newstudent,'周','createdAt')
      }).catch((err)=>{
          console.log(err)
      })
  }
}
</script>

<style scoped>
#myChart{
    width: 1150px;
    height: 450px;
}
.changeTime span{
  padding:0 10px;
  cursor: pointer;
}
.active{
  color:#409EFF;
}
</style>